<template>
  <div>
    <template v-if="$app.judgeData(orderInfo) && $app.judgeData(orLiInfo)">

      <!-- 订单状态,0已取消,1已下单,2已支付 -->
      <template v-if="(aTopType==1 && orderInfo.state==1) || aTopType==3">
        <!-- 右上角 fixed框：官费，服务，总价 -->
        <div class="rMoneyBox padding10"
          :style="`width:${suoJ?'200px':'50px'}; height:${suoJ?'auto':'50px'};`"
        >
          <div v-show="suoJ">
            <div class="f_16 f_bold  c333 marginB10">{{orLiInfo.goods_name}}</div>
            <div class="paddingLR15 c999">
              <div class="f_14">
                官费：¥
                <span>{{parseFloat(orLiInfo.official_fee)}}</span>
              </div>
              <div class="f_14 marginB5">
                服务费：¥
                <span>{{parseFloat(orLiInfo.service_fee)}}</span>
              </div>
              <div class="f_16">
                价格：¥
                <span class="cRed f_24 f_bold">{{parseFloat(orLiInfo.order_money)}}</span>
              </div>
            </div>
          </div>
          <Icon 
            :type="`${suoJ?'ios-arrow-dropright':'ios-arrow-dropleft-circle'}`"
            size="28"
            class="pointer suoJ "
            :class="`${suoJ?' cCCC':' cBlue'}`"
            @click="suoJ=!suoJ"
          />
        </div>
      </template>

      



      <div class="SQ_One_R  pullLeft" style="border-right:1px solid #eee;">
        <div class="lineH34 c333 f_16 f_bold marginB20">当前进度</div>
        <Row class="marginB15" :gutter="5">
          <Col :span="7" style="top:13px;" class="relative textRight">订单状态：</Col>
          <Col :span="17" class="f_24 cBlue f_bold">{{orderInfo.state_name}}</Col>
        </Row>
        <Row class="marginB15" :gutter="5">
          <Col :span="7" class="relative textRight">服务类型：</Col>
          <Col :span="17">{{orLiInfo.goods_name}}</Col>
        </Row>
        <Row class="marginB10" :gutter="5">
          <Col :span="7" class="relative textRight">订单编号：</Col>
          <Col :span="17">{{orLiInfo.order_no}}</Col>
        </Row>
      </div>
      
    </template>

  </div>
</template>



<script>


export default {
  name: "aTopBase",
  components: {},

  // aTopType 1专利 2商标 3版权
  props: ["orderInfo", "orLiInfo","aTopType"],
  data() {
    let data = {};
    let tool = {
      suoJ:true//右上角浮动框：true显示，false隐藏
    };
    return Object.assign(data, tool);
  },
  watch: {},
  mounted() {},
  methods: {}
};
</script>

